<template>
    <div>
        <van-search v-model="sea" shape="round" background="#4fc08d" placeholder="请输入搜索关键词" />

        <div v-if="sea.length == 0 || searchApiData.length == 0">
            <van-empty description="描述文字" />
        </div>

        <div v-else>
            <van-card v-for="item in searchApiData" :price="item.goods_price" :title="item.goods_name" />
        </div>

    </div>
</template>

<script setup>
import { ref, watch } from 'vue'
import { searchApi } from '@/api/api'
const sea = ref('')
const searchApiData = ref([])
watch(sea, (val) => {
    console.log('监听的数据', val);

    searchApi().then(res => {
        console.log('搜索的数据', res);
        searchApiData.value = res.data.message.goods
    })
})

</script>

<style lang="scss" scoped></style>